<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增转库记录')" />
</head>
<body  >
<div class="container-div">
    <el-divider content-position="left" style="margin-bottom: 20px">转库单信息</el-divider>
    <el-form  :inline="true" label-position="left" :model="insert.transferRecord.info" ref="insertForm" label-width="100px" :rules="insert.transferRecord.rules" class="demo-ruleForm">

        <el-form-item   label="箱号" prop="boxCode" >
            <el-input v-model="insert.transferRecord.info.boxCode"></el-input>
        </el-form-item>

        <el-form-item   label="料号" prop="itemCode" >
            <el-input v-model="insert.transferRecord.info.itemCode"></el-input>
        </el-form-item>

        <el-form-item   label="物料描述" >
            <el-input v-model="insert.transferRecord.info.itemName"></el-input>
        </el-form-item>

        <el-form-item   label="批次"  prop="batch"  >
            <el-input v-model="insert.transferRecord.info.batch"></el-input>
        </el-form-item>

        <el-form-item   label="数量（张）" >
            <el-input v-model="insert.transferRecord.info.quantity"></el-input>
        </el-form-item>

        <el-form-item   label="转库人" >
            <el-input v-model="insert.transferRecord.info.operatorName"></el-input>
        </el-form-item>

        <el-form-item   label="转库人卡号"  prop="transferCardNo"  >
            <el-input v-model="insert.transferRecord.info.transferCardNo"></el-input>
        </el-form-item>

        <el-form-item label="子库">
            <el-select v-model="insert.transferRecord.info.forSubinventory" placeholder="请选择子库">
                <el-option v-for="(item, index) in rows" :key="index" :label="item.subInventoryName" :value="item.subInventoryId"></el-option>
            </el-select>
        </el-form-item>

        <el-form-item label="目标子库">
            <el-select v-model="insert.transferRecord.info.toSubinventory" placeholder="请选择目标子库">
                <el-option v-for="(item, index) in rows" :key="index" :label="item.subInventoryName" :value="item.subInventoryId"></el-option>
            </el-select>
        </el-form-item>

        <el-form-item   label="转移原因" >
            <el-input v-model="insert.transferRecord.info.transferMemo"></el-input>
        </el-form-item>

    </el-form>
    <div style="margin-left: 40%">
        <el-button type="primary" @click="save()">保存</el-button>
        <el-button type="info" @click="closeModal()">返回</el-button>
    </div>
</div>

<div th:include="include::footer"></div>
<script type="text/javascript" charset="UTF-8">
    var prefix = ctx + "manage/transferRecord"
    var app = new Vue({
        el: '.container-div',
        data: {
            insert:{
                transferRecord:{
                    info:{},
                    rules:{
                        boxCode: [
                            { required: true, message: '请输入箱号', trigger: 'blur' }
                        ],
                        itemCode: [
                            { required: true, message: '请输入料号', trigger: 'blur' }
                        ],
                        batch: [
                            { required: true, message: '请输入批次', trigger: 'blur' }
                        ],
                        transferCardNo: [
                            { required: true, message: '请输入转库人卡号', trigger: 'blur' }
                        ],
                        forSubInventoryCode: [
                            { required: true, message: '请输入字库编码', trigger: 'blur' }
                        ],
                        toSubInventoryCode: [
                            { required: true, message: '请输入目标字库编码', trigger: 'blur' }
                        ],
                    }
                }
            },
            rows: []
        },
        methods:{
            /*关闭此页面*/
            closeModal:function(){
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            },
            save:function(){
                var that = this;
                /*校验billMaster数据*/
                this.$refs['insertForm'].validate((valid) => {
                    if (valid) {
                        var data = JSON.stringify(that.insert.transferRecord.info)
                        $.ajax({
                            cache : true,
                            type : "POST",
                            url :  "/subinventoryTransferRecord/insert",
                            data : data,
                            dataType:"json",
                            contentType: "application/json;charset-UTF-8",
                            async : false,
                            // beforeSend: function () {
                            // 	$.modal.loading("正在处理中，请稍后...");
                            // },
                            error : function(request) {
                                $.modal.alertError("系统错误");
                            },
                            success : function(data) {
                                if (data.code == web_status.SUCCESS) {
                                    $.modal.msgReload(data.msg, "success")
                                } else if (data.code == web_status.WARNING) {
                                    $.modal.alertWarning(data.msg)
                                } else {
                                    $.modal.alertError(data.msg);
                                }
                            }
                        });
                    }else{
                        return false;
                    }
                });
            }
        },
        created(){
            var that = this;
            $.ajax({
                cache : true,
                type: "POST",
                url: "/subInventory/list",
                data : {
                },
                dataType: "json",
                contentType: "application/json;charset-UTF-8",
                async : false,
                error : function(request) {
                    $.modal.alertError("系统错误");
                },
                success: function(res){
                    that.rows = res.rows;
                }
            })
        }
    })
</script>
</body>
</html>
